import React from 'react';
import type { CustomIconComponentProps } from '@ant-design/icons/lib/components/Icon';
import Icon from '@ant-design/icons';

const ZipFileSvg = () => (
  <svg width="62" height="68" viewBox="0 0 62 68" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path
      d="M40.5 1H3C1.89543 1 1 1.89543 1 3V65C1 66.1046 1.89543 67 3 67H49.5C50.6046 67 51.5 66.1046 51.5 65V13.5L40.5 1Z"
      fill="#F7FCFF"
      stroke="#4E93FB"
      strokeWidth="2"
    />
    <path
      d="M40.5 13.5V1L51.5 13.5H40.5Z"
      stroke="#4E93FB"
      strokeWidth="2"
      strokeLinejoin="round"
    />
    <rect x="17.5" y="31" width="44" height="24" rx="2" fill="#4E93FB" />
    <path
      d="M29.256 48V46.306L34.324 39.964L34.31 39.88H29.536V38.284H36.55V39.908L31.426 46.306V46.39H36.9V48H29.256ZM38.6168 48V38.284H40.4508V48H38.6168ZM42.7457 48V38.284H45.8537C48.7097 38.284 49.5917 39.222 49.5917 41.518C49.5917 43.968 48.4997 44.85 45.8537 44.85H44.5797V48H42.7457ZM44.5797 43.366H45.6297C47.1977 43.366 47.7157 42.96 47.7157 41.546C47.7157 40.216 47.1837 39.768 45.6297 39.768H44.5797V43.366Z"
      fill="white"
    />
  </svg>
);

const ZipFileIcon = (props: Partial<CustomIconComponentProps>) => {
  return <Icon component={ZipFileSvg} {...props} />;
};

export default ZipFileIcon;
